
<script setup>
import { useGroupStore } from "@/stores/groupStore.js";
import { userStore } from "@/stores/userStore.js";
import axios from "axios";
import {onBeforeUnmount, onMounted, onUnmounted, ref} from "vue";
import {host_custom} from "@/host.js";
import router from "@/router/index.js";
import { useSocket } from "@/socket.js";
import { useFriendStore } from "@/stores/friendStore.js";
import {getFriends} from "@/api/friend.js";
import {getJoinedGroup} from "@/api/group.js";

useFriendStore().storeGetFriendList()

const groupStore = useGroupStore()
const { userInfo, setUserSetting } = userStore()

const friendListData = ref([]);
const userSetting = ref([])

const progressText = ref('准备中')
const setUserOnline = async () => {
  progressText.value = '设置用户上线'
  const res = await getFriends(userInfo.id)
  const res2 = await getJoinedGroup(userInfo.id)

  if (res.status === 200) {
    friendListData.value = res.data;
    useSocket().emit("setOnline", {
      uid: userInfo.id,
      friendList: res.data,
      joinedGroup: res2.data
    });
  } else {
    console.error(res);
  }
}

const getUserSetting = async () => {
  progressText.value = '获取用户信息'
  const res = await axios.get(host_custom+'/getUserSettings', {params: {uid: userInfo.id}})
  userSetting.value = res.data[0]
  setUserSetting(userSetting.value)
  document.documentElement.setAttribute('data-bs-theme', userSetting.value.theme ? 'dark' : 'light');
  progressText.value = '加载中，请稍等'
}

onMounted(async ()=> {
  // await getUserJoinedGroups()
  await setUserOnline()
  await getUserSetting()
  setTimeout(()=> {
    router.replace('/home')
  }, 2500)
})

</script>

<template>
  <div class="vh-100 d-flex flex-column justify-content-center align-items-center">

    <div class="spinner-border text-primary" style="width: 2.5rem; height: 2.5rem" role="status"></div>
    <small class="my-2 ps-2" style="font-family: system-ui">等待脚本...</small>
    <small class="text-warning" style="font-size: 12px; font-style: italic">{{ progressText }}</small>

  </div>
</template>

<style scoped>

</style>